/*
 * @LastEditors: yuSeen
 * @LastEditTime: 2022-01-07 18:40:11
 * 天凉好个秋
 */
import { useConcent } from "concent";
import { useLocalStorage } from '@/hooks/localStorage/useLocalStorage'

const { setStorageItem } = useLocalStorage()

const setup = (ctx: any) => {
  return {
    setTheme: (color: string) =>
      ctx.moduleReducer.setThemeColor(color),
  };
};

export const useThemeSetting = () => {
  const { state, settings } = useConcent({ module: "setting", setup });
  const htmlRoot = document.getElementById("htmlRoot") as HTMLElement;

  //   设置主题
  const setThemeColor = (color: string) => {
    htmlRoot.style.setProperty("--theme-color", color);
    settings.setTheme(color);
    setStorageItem('themeColor', color)
  };

  return {
    themeColor: state.themeColor,
    setThemeColor
  };
};
